import React, { useEffect, useState } from 'react'
import type { TableColumnsType } from 'antd';
import { Button, Space, Table } from 'antd';
import { DelTag, GetUserTag } from '@/apis/user';
import AddUserTag from '@/components/addUserTag';
import AddUserCate from '@/components/addUserCate';

interface DataType {
    key: React.Key;
    name: string;
    platform: string;
    version: string;
    upgradeNum: number;
    creator: string;
    createdAt: string;
}


type Props = {}

const Tag = (props: Props) => {
    const [list, setList] = useState([])
    const [parent, SetParent] = useState(0)//0是父标签
    const [visiable, setVisiable] = useState(false)
    const [categroy, setCategroy] = useState(false)

    useEffect(() => { getAll() }, [])

    // 获取标签
    const getAll = async () => {
        const res: any = await GetUserTag({ parent })
        console.log(res);
        setList(res.data)
    }
    const columns: TableColumnsType<DataType> = [
        { title: 'ID', dataIndex: '_id' },
        // { title: '标签名称', dataIndex: 'name', },
        { title: '分类名称', dataIndex: 'name' },
        {
            title: '操作', dataIndex: '',
            render: (text: any) => (
                <Space>
                    <a onClick={() => del(text._id)}>删除</a>
                </Space>)
        },
    ];
    // 模态框
    const close = (state: boolean) => {
        setVisiable(state)
        setCategroy(state)
        getAll()
    }
    // 删除
    const del = async (_id: string) => {
        const res = await DelTag({ _id })
        console.log(res);
        getAll()
    }

    return (
        <>
            <Space>
                <Button type='primary' onClick={() => setVisiable(true)}>+ 添加标签</Button>
                <Button onClick={() => setCategroy(true)}>+ 添加分类</Button>
            </Space>
            <Table columns={columns} dataSource={list} rowKey='_id' pagination={false} scroll={{ y: 600 }} />
            <AddUserTag visiable={visiable} close={close} />
            <AddUserCate visiable={categroy} close={close} />
        </>
    )
}

export default Tag